import React from 'react';
import './selecType.scss';

const SelectType = React.createClass({
    onClick(item) {
        if (this.props.onChange) {
            this.props.onChange(item.id, item.name, item);
        }
    },
    render() {
        let node;

        if (this.props.data) {
            node = this.props.data.map((item) => {
                let selectClass = ''
                if (item.id === this.props.value) {
                    selectClass = 'select';
                }
                return <div className={"flex-g-1 cell " + selectClass} key={item.id} onClick={this.onClick.bind(this, item)}>{item.name}</div>
            })
        }

        return (
            <div className="selectType flex-center">
                <div className="flex-col-10 flex-center bar selectTimeType">
                    {node}
                </div>
            </div>
        )
    }
});

module.exports = SelectType;